Mac&iPad 在字元、顏色、圖示中的差異 （指南）

Type 字元

A 在macos上，標準字型大小是 13pt，大部分控制元件和標籤都是這個字號。在iOS上，標準字型大小是17pt。因此在Mac顯示帶有17pt大小的字 （iOS）文字會顯得過大應用程式會顯得很不協調。

B 為了保持與 Mac應用程式之間的一致性，系統會把內容區域縮小 77%。77%，是13除以17的結果

從人體工程學角度講 用mac時候眼睛距離螢幕遠，而手機舉例眼睛近，為什麼近的反而要用字號大的呢？

視距與視角:

手機：通常在較近的距離（大約 25-30 釐米）使用。由於螢幕較小，使用者需要在較小的視角範圍內讀取資訊。為了確保資訊在較小的螢幕上仍然易於閱讀，字型大小通常需要更大，以便在較小的視角範圍內清晰可見。

Mac：通常在較遠的距離（大約 50-70 釐米）使用。因為螢幕較大，文字可以在更大的視角範圍內呈現，且使用者的眼睛可以在更大的範圍內移動，因此字型可以相對較小。

使用環境和使用者習慣:

手機通常在各種不同的環境下使用，包括移動中的場景，如走路、乘坐公共交通等。這些情況下，使用者需要快速獲取資訊，因此更大的字型可以幫助提高可讀性和資訊的獲取速度。

Mac 大多在相對固定、穩定的工作環境中使用，使用者有更多的時間和注意力來閱讀內容，因此可以使用較小的字型來顯示更多資訊。

文字量與介面設計:

手機介面的顯示區域有限，為了確保使用者能夠輕鬆閱讀和互動，設計上通常會選擇較大的字型，同時減少螢幕上的文字量。

Mac 的顯示區域更大，可以容納更多的內容，因此使用較小的字型可以顯示更多的資訊而不會顯得擁擠。

設計iPad 應用的原型時，你需要用到那個77%的縮放比例

比如在 Photoshop 裡，可以把所有內容放在一個智慧物件裡，然後把它縮小到77%

C 在 macOS 上，應用程式只使用幾種不同的字型大小。在iOS上截然相反，

iOS 排版系統中包含了很多字號選擇（排版系統是指管理和設定文字顯示的規則和引數的框架）

使用一些最小的字號（如腳註、標題一、標題二）可能會導致在 Mac 上難以閱讀。即使mac字號偏小，但也承受不了iOS 中的最小字號。所以建議把字號調大一點，讓它在Mac上更容易看清楚

D Mac 系統不支援動態字型大小的調整。蘋果將始終使用大號設定，只是將其縮小77%（iOS可以因為使用者設定自動適應應用內部字型大小而Mac不可以，Mac只可以改變電腦系統本身的字型大小）

Color 色彩

「顏色」APP都有屬於特定的高亮色代表可操作的區域。有些App還會給內容區域或者背景欄填色

在mac系統中則不同。人們的電腦通常上會開很多視窗，視窗裡東西很多，桌面上也堆滿了檔案和資料夾。

mac像iOS那樣使用顏色，會干擾使用者的注意力，導致介面顯得雜亂無章。Mac的介面應設計的更中性。

人們關心的是內容本身，介面設計應服務於內容展示，而不是與之爭奪使用者的注意力。

Gestures 手勢

A Ulkit系統可以直接轉換成觸控板或滑鼠的操作UIKit是蘋果開發的一個圖形使用者介面框架，鳥貪介面控制元件、佈局和檢視，動畫與過渡、圖形和繪圖、多工處理、AIP等。

手指按下相當於滑鼠點選，手指長按相當於滑鼠點選不放。手指滑動相當於滑鼠方向和控制的拖動。

B 在mac觸控板上，捏合和旋轉動作仍然有效，但與ipad稍有不同，在iPad上，縮放和旋轉動作是以兩指之間的中點為中心進行的（這意味著操作的精確性和以使用者觸控為中心的互動）在Mac上，這些操作就是根據滑鼠游標的位置來進行的

C 但如果在螢幕邊緣，手指的滑動就不會對映到滑鼠的拖動（原因是iOS系統螢幕邊緣會用於調起系統設定，而imac不需要）

D 有些手勢在Mac上的轉換效果就不好。如拉動滾動檢視以重新整理內容這個操作。

所以對於那些透過手勢輸入觸發的操作，mac的設計上需要找到其他方式替代。如使用選單欄、右鍵選單、工具欄上的按鈕或以上操作相組合等。

E 在Mac上，可以設定滑鼠懸停時 （hover） 會發生的事件，可以用它來顯示更多資訊。

在iOS的股票app中，按一下股票圖表可以檢視某個具體時間的股價，他的優勢是讓使用者在不需要改變所選內容的情況下獲取資訊，可以提高應用的使用者體驗和資訊訪問的便捷性

icon圖示

應用圖示的獨特性在於幫助使用者識別和區別應用程式。mac 圖示會出現在許多地方，如doC、應用切換器、啟動臺、應用資料夾。

歷史小故事：

19年的策略與24年的不同，目前已經更靠近iOS，鼓勵統一的圓角矩形。

19年策略：Mac圖示與iOS 圖示有不同的設計特徵，獨特的外形，能讓圖示之間增加差異性。

在小尺寸下，這些輪廓可以幫助圖示更容易地從彼此中區分開。

在16px尺寸中每個畫素的最佳化都對整體視覺效果有顯著影響。在最小的應用圖示尺寸上建立完美畫素的圖示是必要的（Pixel Perfect lcons 是一種圖形設計技術，用於在低解析度下最佳化圖示的清晰度）

Mac的應用圖示往往使用擬物風格，以提升直觀性和易認性

24年不同，預設情況，應用圖示是一個圓角矩形，會加融入一個微弱的陰影，這樣看起來圖示之間更協調。

這種變化背後的原因主要有以下幾點：

統一的視覺語言：隨著Apple生態系統的不斷整合，統一的圖示設計能夠為使用者提供更一致的體驗。不論是在iPhone、iPad還是Mac上，使用者看到的應用圖示都具有相似的外形，這有助於建立更統一和連貫的品牌形象。

提升美感和簡潔性：圓角矩形的圖示設計簡潔、現代，符合當前的設計趨勢。它能夠在視覺上提供一種整齊、有序的感覺，與Apple追求的極簡主義設計理念相吻合。

跨平臺一致性：許多應用程式同時在iOS和macOS上釋出，統一的圖示設計能夠減少開發者的工作量，同時也讓使用者在不同裝置上使用相同應用時更容易識別和理解。

提高可訪問性：統一的圖示形狀在視覺上更具一致性，這對某些使用者（特別是視力有障礙的使用者）來說，可能會更容易理解和操作。